<template>
  <div :class="prefixCls">
    <div ref="editor" class="editor-wrapper"></div>
  </div>
</template>

<script>
import WEditor from 'wangeditor'

export default {
  name: 'WangEditor',
  props: {
    prefixCls: {
      type: String,
      default: 'my-editor-wang'
    },
    // eslint-disable-next-line
    value: {
      type: String,
      default: ''
    },
    isClear: {
      type: Boolean,
      default: false
    }
  },
  data () {
    return {
      editor: null,
      editorContent: null
    }
  },
  watch: {
    // value (val) {
    //   this.editorContent = val
    //   this.editor.txt.html(val)
    // },
    isClear (val) {
      // 触发清除文本域内容
      if (val) {
        this.editor.txt.clear()
        this.editorContent = null
      }
    }
  },
  mounted () {
    this.initEditor()
  },
  methods: {
    getText () {
      this.editor.txt.text()
    },
    setText (val) {
      this.editor.txt.html(val)
    },
    initEditor () {
      this.editor = new WEditor(this.$refs.editor)
      // this.editor = new E(this.$refs.toolbar, this.$refs.editor)
      this.editor.customConfig.uploadImgShowBase64 = false // base 64 存储图片
      this.editor.customConfig.showLinkImg = false
      this.editor.customConfig.uploadImgServer =
        'https://jfk-api.letuilm.com/api/upload_img' // 配置服务器端地址 找后端要
      this.editor.customConfig.uploadImgHeaders = {} // 自定义 header
      this.editor.customConfig.uploadFileName = 'file' // 后端接受上传文件的参数名
      this.editor.customConfig.uploadImgMaxSize = 2 * 1024 * 1024 // 将图片大小限制为 2M
      this.editor.customConfig.uploadImgMaxLength = 6 // 限制一次最多上传 3 张图片
      this.editor.customConfig.uploadImgTimeout = 3 * 60 * 1000 // 设置超时时间
      this.editor.customConfig.emotions = [
        {
          // tab 的标题
          title: '默认',
          // type -> 'emoji' / 'image'
          type: 'image',
          // content -> 数组
          content: [
            {
              alt: '[微笑]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/e3/2018new_weixioa02_org.png'
            },
            {
              alt: '[可爱]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/09/2018new_keai_org.png'
            },
            {
              alt: '[太开心]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/1e/2018new_taikaixin_org.png'
            },
            {
              alt: '[鼓掌]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/6e/2018new_guzhang_org.png'
            },
            {
              alt: '[嘻嘻]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/33/2018new_xixi_org.png'
            },
            {
              alt: '[哈哈]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/8f/2018new_haha_org.png'
            },
            {
              alt: '[笑cry]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/4a/2018new_xiaoku_thumb.png'
            },
            {
              alt: '[挤眼]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/43/2018new_jiyan_org.png'
            },
            {
              alt: '[馋嘴]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/fa/2018new_chanzui_org.png'
            },
            {
              alt: '[黑线]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/a3/2018new_heixian_org.png'
            },
            {
              alt: '[汗]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/28/2018new_han_org.png'
            },
            {
              alt: '[挖鼻]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/9a/2018new_wabi_thumb.png'
            },
            {
              alt: '[哼]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/7c/2018new_heng_org.png'
            },
            {
              alt: '[怒]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/f6/2018new_nu_org.png'
            },
            {
              alt: '[委屈]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/a5/2018new_weiqu_org.png'
            },
            {
              alt: '[可怜]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/96/2018new_kelian_org.png'
            },
            {
              alt: '[失望]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/aa/2018new_shiwang_org.png'
            },
            {
              alt: '[悲伤]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/ee/2018new_beishang_org.png'
            },
            {
              alt: '[泪]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/6e/2018new_leimu_org.png'
            },
            {
              alt: '[允悲]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/83/2018new_kuxiao_org.png'
            },
            {
              alt: '[害羞]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/c1/2018new_haixiu_org.png'
            },
            {
              alt: '[污]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/10/2018new_wu_org.png'
            },
            {
              alt: '[憧憬]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/c9/2018new_chongjing_org.png'
            },
            {
              alt: '[舔屏]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/3e/2018new_tianping_org.png'
            },
            {
              alt: '[坏笑]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/4d/2018new_huaixiao_org.png'
            },
            {
              alt: '[阴险]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/9e/2018new_yinxian_org.png'
            },
            {
              alt: '[笑而不语]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/2d/2018new_xiaoerbuyu_org.png'
            },
            {
              alt: '[偷笑]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/71/2018new_touxiao_org.png'
            },
            {
              alt: '[酷]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/c4/2018new_ku_org.png'
            },
            {
              alt: '[并不简单]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/aa/2018new_bingbujiandan_org.png'
            },
            {
              alt: '[思考]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/30/2018new_sikao_org.png'
            },
            {
              alt: '[疑问]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/b8/2018new_ningwen_org.png'
            },
            {
              alt: '[费解]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/2a/2018new_wenhao_org.png'
            },
            {
              alt: '[晕]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/07/2018new_yun_org.png'
            },
            {
              alt: '[衰]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/a2/2018new_shuai_org.png'
            },
            {
              alt: '[骷髅]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/a1/2018new_kulou_org.png'
            },
            {
              alt: '[嘘]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/b0/2018new_xu_org.png'
            },
            {
              alt: '[闭嘴]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/62/2018new_bizui_org.png'
            },
            {
              alt: '[傻眼]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/dd/2018new_shayan_org.png'
            },
            {
              alt: '[吃惊]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/49/2018new_chijing_org.png'
            },
            {
              alt: '[吐]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/08/2018new_tu_org.png'
            },
            {
              alt: '[感冒]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/40/2018new_kouzhao_org.png'
            },
            {
              alt: '[生病]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/3b/2018new_shengbing_org.png'
            },
            {
              alt: '[拜拜]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/fd/2018new_baibai_org.png'
            },
            {
              alt: '[鄙视]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/da/2018new_bishi_org.png'
            },
            {
              alt: '[白眼]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/ef/2018new_landelini_org.png'
            },
            {
              alt: '[左哼哼]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/43/2018new_zuohengheng_org.png'
            },
            {
              alt: '[右哼哼]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/c1/2018new_youhengheng_org.png'
            },
            {
              alt: '[抓狂]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/17/2018new_zhuakuang_org.png'
            },
            {
              alt: '[怒骂]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/87/2018new_zhouma_org.png'
            },
            {
              alt: '[打脸]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/cb/2018new_dalian_org.png'
            },
            {
              alt: '[顶]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/ae/2018new_ding_org.png'
            },
            {
              alt: '[互粉]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/86/2018new_hufen02_org.png'
            },
            {
              alt: '[钱]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/a2/2018new_qian_org.png'
            },
            {
              alt: '[哈欠]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/55/2018new_dahaqian_org.png'
            },
            {
              alt: '[困]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/3c/2018new_kun_org.png'
            },
            {
              alt: '[睡]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/e2/2018new_shuijiao_thumb.png'
            },
            {
              alt: '[吃瓜]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/01/2018new_chigua_org.png'
            },
            {
              alt: '[doge]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/a1/2018new_doge02_org.png'
            },
            {
              alt: '[二哈]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/22/2018new_erha_org.png'
            },
            {
              alt: '[喵喵]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/7b/2018new_miaomiao_org.png'
            },
            {
              alt: '[赞]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/e6/2018new_zan_org.png'
            },
            {
              alt: '[good]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/8a/2018new_good_org.png'
            },
            {
              alt: '[ok]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/45/2018new_ok_org.png'
            },
            {
              alt: '[耶]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/29/2018new_ye_org.png'
            },
            {
              alt: '[握手]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/e9/2018new_woshou_org.png'
            },
            {
              alt: '[作揖]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/e7/2018new_zuoyi_org.png'
            },
            {
              alt: '[来]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/42/2018new_guolai_org.png'
            },
            {
              alt: '[拳头]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/86/2018new_quantou_org.png'
            },
            {
              alt: '[咸咸粽]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/7f/duanwu2020_xianxianzong_org.png',
              hot: true
            },
            {
              alt: '[甜甜粽]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/0d/duanwu2020_tiantianzong_org.png',
              hot: true
            },
            {
              alt: '[中国赞]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/6d/2018new_zhongguozan_org.png',
              hot: true
            },
            {
              alt: '[抱抱]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/42/2018new_baobao_org.png',
              hot: true
            },
            {
              alt: '[摊手]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/62/2018new_tanshou_org.png',
              hot: true
            },
            {
              alt: '[跪了]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/75/2018new_gui_org.png',
              hot: true
            },
            {
              alt: '[酸]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/b3/hot_wosuanle_org.png',
              hot: true
            },
            {
              alt: '[能量少女耶]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/4d/chuangzaoying_shoushi_org.png',
              hot: true
            },
            {
              alt: '[为爱发光]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/20/chuangzaoying_yingyuan_org.png',
              hot: true
            },
            {
              alt: '[创造营2020]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/77/chuangzaoying_biaoshi_org.png',
              hot: true
            },
            {
              alt: '[哆啦A梦吃惊]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/f0/dorachijing_org.gif',
              hot: true
            },
            {
              alt: '[哆啦A梦微笑]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/9e/jqmweixiao_org.gif',
              hot: true
            },
            {
              alt: '[心]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/8a/2018new_xin_org.png'
            },
            {
              alt: '[伤心]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/6c/2018new_xinsui_org.png'
            },
            {
              alt: '[鲜花]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/d4/2018new_xianhua_org.png'
            },
            {
              alt: '[男孩儿]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/0a/2018new_nanhai_org.png'
            },
            {
              alt: '[女孩儿]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/39/2018new_nvhai_org.png'
            },
            {
              alt: '[熊猫]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/aa/2018new_xiongmao_org.png'
            },
            {
              alt: '[兔子]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/c6/2018new_tuzi_org.png'
            },
            {
              alt: '[猪头]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/1c/2018new_zhutou_thumb.png'
            },
            {
              alt: '[草泥马]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/3b/2018new_caonima_org.png'
            },
            {
              alt: '[奥特曼]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/c6/2018new_aoteman_org.png'
            },
            {
              alt: '[太阳]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/cd/2018new_taiyang_org.png'
            },
            {
              alt: '[月亮]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/d5/2018new_yueliang_org.png'
            },
            {
              alt: '[浮云]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/61/2018new_yunduo_org.png'
            },
            {
              alt: '[下雨]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/7e/2018new_yu_org.png'
            },
            {
              alt: '[沙尘暴]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/b7/2018new_shachenbao_org.png'
            },
            {
              alt: '[微风]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/c7/2018new_weifeng_thumb.png'
            },
            {
              alt: '[围观]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/6c/2018new_weiguan_org.png'
            },
            {
              alt: '[飞机]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/4a/2018new_feiji_org.png'
            },
            {
              alt: '[照相机]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/78/2018new_xiangji_org.png'
            },
            {
              alt: '[话筒]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/48/2018new_huatong_org.png'
            },
            {
              alt: '[蜡烛]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/16/2018new_lazhu_org.png'
            },
            {
              alt: '[音乐]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/1f/2018new_yinyue_org.png'
            },
            {
              alt: '[喜]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/e0/2018new_xizi_org.png'
            },
            {
              alt: '[给力]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/36/2018new_geili_org.png'
            },
            {
              alt: '[威武]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/14/2018new_weiwu_org.png'
            },
            {
              alt: '[干杯]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/40/2018new_ganbei_org.png'
            },
            {
              alt: '[蛋糕]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/f9/2018new_dangao_org.png'
            },
            {
              alt: '[礼物]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/0e/2018new_liwu_org.png'
            },
            {
              alt: '[钟]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/8e/2018new_zhong_org.png'
            },
            {
              alt: '[肥皂]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/d6/2018new_feizao_thumb.png'
            },
            {
              alt: '[绿丝带]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/cb/2018new_lvsidai_org.png'
            },
            {
              alt: '[围脖]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/64/2018new_weibo_org.png'
            },
            {
              alt: '[浪]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/46/2018new_xinlang_org.png'
            },
            {
              alt: '[羞嗒嗒]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/df/lxhxiudada_org.gif'
            },
            {
              alt: '[好爱哦]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/74/lxhainio_org.gif'
            },
            {
              alt: '[偷乐]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/fa/lxhtouxiao_thumb.gif'
            },
            {
              alt: '[赞啊]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/00/lxhzan_thumb.gif'
            },
            {
              alt: '[笑哈哈]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/32/lxhwahaha_org.gif'
            },
            {
              alt: '[好喜欢]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/d6/lxhlike_thumb.gif'
            },
            {
              alt: '[求关注]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/ac/lxhqiuguanzhu_org.gif'
            },
            {
              alt: '[胖丁微笑]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/68/film_pangdingsmile_org.png'
            },
            {
              alt: '[弱]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/3d/2018new_ruo_org.png'
            },
            {
              alt: '[NO]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/1e/2018new_no_org.png'
            },
            {
              alt: '[haha]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/1d/2018new_hahashoushi_org.png'
            },
            {
              alt: '[加油]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/9f/2018new_jiayou_org.png'
            },
            {
              alt: '[佩奇]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/c6/hot_pigpeiqi_org.png'
            },
            {
              alt: '[大侦探皮卡丘微笑]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/b3/pikaqiu_weixiao_org.png'
            },
            {
              alt: '[圣诞老人]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/93/xmax_oldman01_org.png'
            },
            {
              alt: '[紫金草]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/e5/gongjiri_zijinhua_org.png'
            },
            {
              alt: '[文明遛狗]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/93/gongyi_wenminglgnew_org.png'
            },
            {
              alt: '[神马]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/60/horse2_org.gif'
            },
            {
              alt: '[马到成功]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/b0/mdcg_org.gif'
            },
            {
              alt: '[炸鸡啤酒]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/e2/zhajibeer_org.gif'
            },
            {
              alt: '[最右]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/be/remen_zuiyou180605_org.png'
            },
            {
              alt: '[织]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/41/zz2_org.gif'
            },
            {
              alt: '[五仁月饼]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/10/2018zhongqiu_yuebing_org.png'
            },
            {
              alt: '[给你小心心]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/ca/qixi2018_xiaoxinxin_org.png'
            },
            {
              alt: '[吃狗粮]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/0b/qixi2018_chigouliang_org.png'
            },
            {
              alt: '[弗莱见钱眼开]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/83/2018newyear_richdog_org.gif'
            },
            {
              alt: '[超人爸爸]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/6c/2020fuqinjie_chaorenbaba_org.png'
            },
            {
              alt: '[我爱爸爸]',
              type: 'face',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/a0/2020fuqinjie_woaibaba_org.png'
            },
            {
              alt: '[父与子]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/1e/2020fuqinjie_fuyuzi_org.png'
            },
            {
              alt: '[棒棒糖]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/f4/2020liuyi_bangbangtang_org.png'
            },
            {
              alt: '[纸飞机]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/9d/2020liuyi_zhifeiji_org.png'
            },
            {
              alt: '[炸鸡腿]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/8c/yunying_zhaji_org.png'
            },
            {
              alt: '[点亮平安灯]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/6d/feiyan_dianliangpingan_org.png'
            },
            {
              alt: '[武汉加油]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/02/hot_wuhanjiayou_org.png'
            },
            {
              alt: '[点亮橙色]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/87/gongyi_dlchengse03_org.png'
            },
            {
              alt: '[超新星全运会]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/f9/huodong_starsports_org.png'
            },
            {
              alt: '[锦鲤]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/94/hbf2019_jinli_org.png'
            },
            {
              alt: '[看涨]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/fe/kanzhangv2_org.gif'
            },
            {
              alt: '[看跌]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/c5/kandiev2_org.gif'
            },
            {
              alt: '[带着微博去旅行]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/ec/eventtravel_org.gif'
            },
            {
              alt: '[星星]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/76/hot_star171109_org.png'
            },
            {
              alt: '[半星]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/f9/hot_halfstar_org.png'
            },
            {
              alt: '[空星]',
              src:
                'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/ff/hot_blankstar_org.png'
            }
          ]
        },
        {
          // tab 的标题
          title: 'emoji',
          // type -> 'emoji' / 'image'
          type: 'emoji',
          // content -> 数组
          content: [
            '😀',
            '😁',
            '😂',
            '😃',
            '😄',
            '😅',
            '😆',
            '😉',
            '😊',
            '😋',
            '😎',
            '😍',
            '😘',
            '😗',
            '😙',
            '😚',
            '😇',
            '😐',
            '😑',
            '😶',
            '😏',
            '😣',
            '😥',
            '😮',
            '😯',
            '😪',
            '😫',
            '😴',
            '😌',
            '😛',
            '😜',
            '😝',
            '😒',
            '😓',
            '😔',
            '😕',
            '😲',
            '😷',
            '😖',
            '😞',
            '😟',
            '😤',
            '😢',
            '😭',
            '😦',
            '😧',
            '😨',
            '😬',
            '😰',
            '😱',
            '😳',
            '😵',
            '😡',
            '😠',
            '😈',
            '👿',
            '👹',
            '👺',
            '💀',
            '👻',
            '👽',
            '👦',
            '👧',
            '👨',
            '👩',
            '👴',
            '👵',
            '👶',
            '👱',
            '👮',
            '👲',
            '👳',
            '👷',
            '👸',
            '💂',
            '🎅',
            '👰',
            '👼',
            '💆',
            '💇',
            '🙍',
            '🙎',
            '🙅',
            '🙆',
            '💁',
            '🙋',
            '🙇',
            '🙌',
            '🙏',
            '👤',
            '👥',
            '🚶',
            '🏃',
            '👯',
            '💃',
            '👫',
            '👬',
            '👭',
            '💏',
            '💑',
            '👪',
            '💪',
            '👈',
            '👉',
            '☝',
            '👆',
            '👇',
            '✌',
            '✋',
            '👌',
            '👍',
            '👎',
            '✊',
            '👊',
            '👋',
            '👏',
            '👐',
            '✍',
            '👣',
            '👀',
            '👂',
            '👃',
            '👅',
            '💋',
            '⚡',
            '👄',
            '👍',
            '🔥',
            '👓',
            '👔',
            '👕',
            '👖',
            '👗',
            '👘',
            '👙',
            '👚',
            '👛',
            '👜',
            '👝',
            '🎒',
            '💼',
            '👞',
            '👟',
            '👠',
            '👡',
            '👢',
            '👑',
            '👒',
            '🎩',
            '🎓',
            '💄',
            '💅',
            '💍',
            '🌂',
            '🙈',
            '🙉',
            '🙊',
            '🐵',
            '🐒',
            '🐶',
            '🐕',
            '🐩',
            '🐺',
            '🐱',
            '😺',
            '😸',
            '😹',
            '😻',
            '😼',
            '😽',
            '🙀',
            '😿',
            '😾',
            '🐈',
            '🐯',
            '🐅',
            '🐆',
            '🐴',
            '🐎',
            '🐮',
            '🐂',
            '🐃',
            '🐄',
            '🐷',
            '🐖',
            '🐗',
            '🐽',
            '🐏',
            '🐑',
            '🐐',
            '🐪',
            '🐫',
            '🐘',
            '🐭',
            '🐁',
            '🐀',
            '🐹',
            '🐰',
            '🐇',
            '🐻',
            '🐨',
            '🐼',
            '🐾',
            '🐔',
            '🐓',
            '🐣',
            '🐤',
            '🐥',
            '🐦',
            '🐧',
            '🐸',
            '🐊',
            '🐢',
            '🐍',
            '🐲',
            '🐉',
            '🐳',
            '🐋',
            '🐬',
            '🐟',
            '🐠',
            '🐡',
            '🐙',
            '🐚',
            '🐌',
            '🐛',
            '🐜',
            '🐝',
            '🐞',
            '🦋',
            '💐',
            '🌸',
            '💮',
            '🌹',
            '🌺',
            '🌻',
            '🌼',
            '🌷',
            '🌱',
            '🌲',
            '🌳',
            '🌴',
            '🌵',
            '🌾',
            '🌿',
            '🍀',
            '🍁',
            '🍂',
            '🍃',
            '🌍',
            '🌎',
            '🌏',
            '🌐',
            '🌑',
            '🌒',
            '🌓',
            '🌔',
            '🌕',
            '🌖',
            '🌗',
            '🌘',
            '🌙',
            '🌚',
            '🌛',
            '🌜',
            '☀',
            '🌝',
            '🌞',
            '⭐',
            '🌟',
            '🌠',
            '☁',
            '⛅',
            '☔',
            '⚡',
            '❄',
            '🔥',
            '💧',
            '🌊',
            '💩',
            '🍇',
            '🍈',
            '🍉',
            '🍊',
            '🍋',
            '🍌',
            '🍍',
            '🍎',
            '🍏',
            '🍐',
            '🍑',
            '🍒',
            '🍓',
            '🍅',
            '🍆',
            '🌽',
            '🍄',
            '🌰',
            '🍞',
            '🍖',
            '🍗',
            '🍔',
            '🍟',
            '🍕',
            '🍳',
            '🍲',
            '🍱',
            '🍘',
            '🍙',
            '🍚',
            '🍛',
            '🍜',
            '🍝',
            '🍠',
            '🍢',
            '🍣',
            '🍤',
            '🍥',
            '🍡',
            '🍦',
            '🍧',
            '🍨',
            '🍩',
            '🍪',
            '🎂',
            '🍰',
            '🍫',
            '🍬',
            '🍭',
            '🍮',
            '🍯',
            '🍼',
            '☕',
            '🍵',
            '🍶',
            '🍷',
            '🍸',
            '🍹',
            '🍺',
            '🍻',
            '🍴',
            '⚪',
            '⚫',
            '🔴',
            '🔵',
            '♈',
            '♉',
            '♊',
            '♋',
            '♌',
            '♍',
            '♎',
            '♏',
            '♐',
            '♑',
            '♒',
            '♓',
            '⛎',
            '💘',
            '❤',
            '💓',
            '💔',
            '💕',
            '💖',
            '💗',
            '💙',
            '💚',
            '💛',
            '💜',
            '💝',
            '💞',
            '💟',
            '❣',
            '🌿',
            '🚧',
            '💒',
            '♻',
            '🏧',
            '🚮',
            '🚰',
            '♿',
            '🚹',
            '🚺',
            '🚻',
            '🚼',
            '🚾',
            '⛔',
            '🚫',
            '🚳',
            '🚭',
            '🚯',
            '🚱',
            '🚷',
            '🔞',
            '💯',
            '🔱',
            '⚽',
            '⚾',
            '🏀',
            '🏈',
            '🏉',
            '🎾',
            '🎱',
            '🎀',
            '🎁',
            '🚀',
            '🔨'
          ]
        }
      ]
      // 配置菜单
      this.editor.customConfig.menus = [
        // 'head', // 标题
        'bold', // 粗体
        'fontSize', // 字号
        // 'fontName', // 字体
        // 'italic', // 斜体
        'underline', // 下划线
        // 'strikeThrough', // 删除线
        'foreColor', // 文字颜色
        'backColor', // 背景颜色
        'link', // 插入链接
        'list', // 列表
        'justify', // 对齐方式
        'image', // 插入图片
        // 'quote', // 引用
        'emoticon', // 表情
        // 'table', // 表格
        // 'video', // 插入视频
        // 'code', // 插入代码
        'undo', // 撤销
        'redo' // 重复
        // 'fullscreen' // 全屏
      ]

      this.editor.customConfig.uploadImgHooks = {
        fail: (xhr, editor, result) => {
          // 插入图片失败回调
          console.log(xhr, editor, result)
        },
        success: (xhr, editor, result) => {
          // 图片上传成功回调
          console.log(xhr, editor, result)
        },
        timeout: (xhr, editor) => {
          // 网络超时的回调
          console.log(xhr, editor)
        },
        error: (xhr, editor) => {
          // 图片上传错误的回调
          console.log(xhr, editor)
        },
        customInsert: (insertImg, result, editor) => {
          // 图片上传成功，插入图片的回调
          // result为上传图片成功的时候返回的数据，这里我打印了一下发现后台返回的是result.data：[{"路径的形式"},...]
          // console.log('result.data[0].url', result.data[0].url)
          // insertImg()为插入图片的函数
          // 循环插入图片
          console.log(editor)
          for (let i = 0; i < 1; i++) {
            console.log('result', result) // 根据格式来赋值
            const src = 'http://' + result.data.url // 如果返回的是完整的src就不用拼接
            insertImg(src)
          }
        }
      }
      // 创建富文本编辑器
      this.editor.customConfig.onchange = html => {
        let str = html
        str = str.replace(/\bm.*?;/, 'width:300px') // 更改图片宽度
        this.editorContent = str
        this.$emit('change', this.editorContent) // 将内容同步到父组件中
      }
      this.editor.customConfig.zIndex = 2 // 配置富文本的权重 不然会覆盖其他组件
      this.editor.create()
    }
  }
}
</script>

<style lang="less" scoped>
.my-editor-wang {
  .editor-wrapper {
    text-align: left;
    width: 800px;
  }
}
</style>
